<template>
  <div id="app">


    <van-field v-model="tel" required :readonly="srzt" center clearable label="手机号" placeholder="请输入手机号">
      <template #button>
        <van-button size="small" type="primary" plain :disabled="disable" :class="{ codeGeting:isGeting }"  round color="#fd5979" @click="getVerifyCode">{{getCode}}</van-button>
      </template>
    </van-field>
    <!-- 输入手机号，调起手机号键盘 -->
    <van-field v-model="yzm" type="tel" label="验证码" placeholder="请输入验证码" v-show="show" >
        <template #button>
          <van-button size="small" type="primary"  round color="#fc597e" @click="buttel">&nbsp;&nbsp;&nbsp;&nbsp;保&nbsp;&nbsp; 存&nbsp;&nbsp;&nbsp;&nbsp;</van-button>
        </template>
    </van-field>


     <van-cell-group>
       <van-field v-model="names" required label="姓名" placeholder="请输入姓名" />
       <van-field v-model="sfz"  required label="身份证号" placeholder="请输入身份证号" />
     </van-cell-group>

      <p class="info-wz info-wz-ts">请放心填写您的资料，我公司将严格保密用户隐私，内容不对外公示！</p>

      <div class="h-20"></div>
      <van-button color="linear-gradient(to left, #fc597e, #ff5c60)"  :disabled="rztype"  round class="lx-but w-but"  @click="bdxx" >
       {{rztext}}
      </van-button>



  </div>
</template>
<script>
  import Vue from 'vue';
  import { Toast } from 'vant';

  Vue.use(Toast);
export default {
  data () {
    return {
      rztype:false,
      names:'',
      sfz:'',
      srzt:false,
      info:[],
      show:true,
      id:'',
      tel:'',
      yzm:'',
      getCode:'获取验证码',
      rztext:'保存',
      isGeting:false,
      count:60,
      disable:false,
    }
  },
  components: {
  },
  created:function () {
      this.$emit('footer', false);
  },

  mounted () {
    this.recordapi();
  },
  	methods: {

      recordapi(){
          var that = this;
          var userid = that.$cookieStore.getCookie('userid');
          that.$api.post("/Index/member",{'id':userid}).then(res => {
            console.log(res);
            that.info = res.info;
            that.tel = res.info.mobile;
            that.names = res.info.names;
            that.sfz = res.info.sfz;
            if(res.info.mobile !== ''){
              that.getCode = "已验证"
              that.disable = true;
              that.show = false;
              that.srzt= true;
            }
            if(res.info.rzzt == 1){
              that.rztext="已认证"
              that.rztype="true"
            }

          });
      },

      getVerifyCode(){
        var that= this;
        var tel = that.tel;
        console.log(tel)
        let reg =/^1[3456789]\d{9}$/
        if (tel == '' || tel.length !==  11 || !reg.test(tel)) {
            Toast("请输入正确手机号");
            return false
        }
        that.$api.post("/Upload/yzm",{'tel':tel}).then(res => {
            console.log(res);
            if(res.code == 1){
              Toast("发送成功");
            }

            this.$cookieStore.setCookie( 'yzms' ,res.msg, 61);
        })
        var countDown = setInterval(()=>{
          if(this.count < 1){
            this.isGeting = false;
            this.disable = false;
            if(this.count == 0){
              this.getCode = '已验证';
              that.disable = true;
            }else{
              this.getCode = '获取验证码';
            }
            this.count = 60;
            clearInterval(countDown);
          }else{

            this.isGeting = true;
            this.disable = true;
            this.getCode = this.count-- + '秒后重发';
          }
        },1000);
      },


      buttel(){
        var that = this;
        var yzm = that.yzm;
        var tel = that.tel;
        var yzms =  this.$cookieStore.getCookie('yzms');  // 获取返回来的验证码
        var userid =  this.$cookieStore.getCookie('userid');
        if(yzm===yzms){
          that.$api.post("/Member/telbd",{'tel':tel,'userid':userid}).then(res => {
              console.log(res);
              if(res.code==1){
                console.log(that.show);
                this.$cookieStore.delCookie('yzms');
                that.count = 0;
                that.getCode = "已验证";
                that.disable = true;
                that.show = false;
                that.srzt= true;
                Toast(res.msg);

              }
              // this.$cookieStore.setCookie( 'yzms' ,res.msg, 61);
          })
        }else{
           Toast("请输入正确验证码");
        }
      },

      bdxx(){
        var that = this;
        var names = that.names;
        var sfz = that.sfz;
        var userid =  this.$cookieStore.getCookie('userid');

        if(names == ''){
          Toast("请输入姓名");
          return;
        }

        let reg = /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X|x)$/;
       if (sfz == '' || sfz.length !==  18 || !reg.test(sfz)) {
           Toast("请输入身份证号");
           return false;
       }



        that.$api.post("/Member/rz",{'names':names,'sfz':sfz,'userid':userid}).then(res => {
            console.log(res);
            if(res.code==1){
              that.rztext="已认证"
              that.rztype="true"
              Toast(res.msg);
            }
            // this.$cookieStore.setCookie( 'yzms' ,res.msg, 61);
        })


      },




    }
}
</script>
